import React from 'react'
import { NavigationContainer } from '@react-navigation/native'
import { createStackNavigator } from '@react-navigation/stack'
const Stack = createStackNavigator()
import { Colors } from '../Themes'

import LoginScreen from '../Containers/LoginScreen'
import HomeScreen from '../Containers/HomeScreen'
import DevicesHomeScreen from '../Containers/DevicesHomeScreen'
import DevicesSetScreen from '../Containers/DevicesSetScreen'
import DevicesChartScreen from '../Containers/DevicesChartScreen'
import DeviceRuleScreen from '../Containers/DeviceRuleScreen'
import * as RootNavigation from './RootNavigation.js'

 
export default function AppNavigation() {
  return (
    <NavigationContainer ref={RootNavigation.navigationRef}>
      <Stack.Navigator
        screenOptions={{
          headerStyle: { backgroundColor: Colors.buttonColor },
          headerTintColor: 'white',
          headerTruncatedBackTitle:'返回'
        }}>  
        <Stack.Screen name="Login" component={LoginScreen} options={{ headerTitle: null, headerLeft: null, headerTransparent: true }} />
        <Stack.Screen name="Home" component={HomeScreen} options={{ headerTitle: null, headerLeft: null, headerTransparent: true }} />
        <Stack.Screen name="DevicesHome" component={DevicesHomeScreen} options={{ headerTitle: null, headerLeft: null, headerTransparent: true }} />
        <Stack.Screen name="DevicesSet" component={DevicesSetScreen} options={{ headerTitle: null, headerLeft: null, headerTransparent: true }} />
        <Stack.Screen name="DevicesChart" component={DevicesChartScreen} options={{ headerTitle: null, headerLeft: null, headerTransparent: true }} />
        <Stack.Screen name="DeviceRule" component={DeviceRuleScreen} options={{ headerTitle: null, headerLeft: null, headerTransparent: true }} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

